<template>
  <div>
    <el-dialog
      v-model="dialogVisible"
      width="80%"
      align-center
      :show-close="false"
      destroy-on-close
      draggable
    >
      <template #header="{ close }">
        <div class="dialog-header flex justify-between items-center">
          <div>查看评审项目</div>
          <el-icon class="el-icon--left cursor-pointer" @click="close"
            ><CircleCloseFilled color="#fff"
          /></el-icon>
        </div>
      </template>
      <div class="m-[10px]">
        <div class="py-[10px]">专家：{{ expertName }}</div>
        <el-card class="w-full">
          <el-table :data="state.tableData" class="w-full" stripe v-loading="state.loading">
            <el-table-column prop="bookName" label="项目名称" />
            <el-table-column prop="applierName" label="申请人" />
            <el-table-column prop="unitName" label="所属单位" />
            <el-table-column label="评审状态">
              <template #default="{ row }">
                <CustomLabel
                  :map="{
                    notReview: '未评审',
                    submit: '已提交',
                    notSubmit: '未提交',
                    refuseReview: '拒绝评审',
                  }"
                  :mapKey="row.reviewStatus"
              /></template>
            </el-table-column>
            <el-table-column prop="reviewMark" label="评审分值" />
            <el-table-column label="评审结果">
              <template #default="{ row }">
                <CustomLabel
                  :map="{ pass: '建议通过', noPass: '不建议通过' }"
                  :mapKey="row.reviewResult"
              /></template>
            </el-table-column>
          </el-table>
          <div class="mt-[20px] flex justify-end">
            <el-pagination
              v-bind="state.pagination"
              @update:current-page="state.currentChange"
              @update:page-size="state.sizeChange"
            />
          </div>
        </el-card>
      </div>
    </el-dialog>
  </div>
</template>

<script setup>
import useTable from "@/hooks/useTable";
import CustomLabel from "@/views/project/components/CustomLabel.vue";
import { getExpertProject } from "@/api/project/xj/xmps/expert";
const dialogVisible = ref(false);
const expertName = ref("");
const state = ref({
  loading: false,
  pagination: null,
  sizeChange: null,
  currentChange: null,
  tableData: [],
  search: null,
});
//查看
const view = (expertId, name, planId) => {
  dialogVisible.value = true;
  expertName.value = name;
  state.value = useTable((pagin) =>
    getExpertProject({
      pageNum: pagin.pageNum,
      pageSize: pagin.pageSize,
      expertId,
      planId,
    })
  );
};
defineExpose({ view });
</script>

<style scoped lang="scss">
@import url("@/views/project/index.scss");
</style>
